import React, { FC, useEffect, useState } from 'react'
import { Card, Tag } from 'antd'
import { useTranslation } from 'react-i18next'
import { getTags } from '@/api/article'
import { Link } from 'react-router-dom'
const Tags: FC = () => {
  const [tags, setTags] = useState([])
  useEffect(() => {
    getTags()
      .then(({ data }) => {
        setTags(data.data)
      })
      .catch((err) => {
        console.log(err)
      })
  }, [])
  const { t } = useTranslation()
  return (
    <div>
      <div className="mb10">
        <Card size="small" title={t('tag')}>
          {tags.map((item: any) => {
            return (
              <Tag key={item.id}>
                <Link to={'/ressd'}>
                  {item.label} [{item.articleCount}]
                </Link>
              </Tag>
            )
          })}
        </Card>
      </div>
    </div>
  )
}

export default Tags
